﻿@**@
<!DOCTYPE html>
<html lang="en">

<head>
    <base href="/portal">
    <meta charset="utf-8" />
    <link rel="apple-touch-icon" sizes="76x76" href="~/lib/now-ui-kit-pro-v1.2.2/assets/img/apple-icon.png">
    <link rel="icon" href="@(MixService.GetConfig<string>("Favicon") ?? "/css/portal/img/mixcore-logo-green-16x16.png")">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>@ViewData["Title"] - mixcore</title>
    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
    <!--     Fonts and icons     -->
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700,200" rel="stylesheet" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css" />
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <environment names="Development,Staging,Production">
        <!-- CSS Files -->
        <style>

            body {
                display: -ms-flexbox;
                display: flex;
                -ms-flex-align: center;
                align-items: center;
                padding-top: 40px;
                padding-bottom: 40px;
                background-color: #000;
                height: 100%;
            }

                body::before {
                    content: "";
                    background: black;
                    opacity: 0.8;
                    top: 0;
                    left: 0;
                    bottom: 0;
                    right: 0;
                    position: fixed;
                    z-index: -1;
                    background-image: url("/img/background.jpg");
                    background-repeat: no-repeat;
                    background-position: right top;
                    background-attachment: fixed;
                    background-size: cover;
                }

                body::after {
                    content: "";
                    background: black;
                    opacity: 0.5;
                    top: 0;
                    left: 0;
                    bottom: 0;
                    right: 0;
                    position: fixed;
                    z-index: -1;
                    background-image: url("/img/background.jpg");
                    background-repeat: no-repeat;
                    background-position: right top;
                    background-attachment: fixed;
                    background-size: cover;
                    /* Add the blur effect */
                    filter: blur(8px);
                    -webkit-filter: blur(8px);
                }

            .form-signin {
                width: 100%;
                max-width: 330px;
                padding: 15px;
                margin: auto;
            }
        </style>
    </environment>

    <link href="~/css/app-vendor.min.css" rel="stylesheet" />
    <link href="~/css/shared.min.css" rel="stylesheet" />
    <link href="~/css/app-security.min.css" rel="stylesheet" />

    <script src="~/js/particles/particles.min.js"></script>
</head>
<!--
<body class="login-page app-security app-init" ng-app="MixPortal" style="background-image: url('/assets/img/bgs/bg.png');background-position: center;background-repeat: no-repeat;background-size: cover;">
   <mix-loader ng-show="isBusy"></mix-loader>
     <div class="container init-pages">

        <div class="card o-hidden border-0 shadow-lg">
            <div class="card-body p-0">
                <div class="progress" style="height: 2px;">
                        <div class="progress-bar" role="progressbar" style="width: 0%;" aria-valuemin="0" aria-valuemax="100"></div>
                      </div>
                <div class="row no-gutters">
                    <div class="col-lg-8">
                        <div class="left-coloumn">
                        </div>
                    </div>
                    <div class="col-lg-4 d-none d-lg-block bg-register-image">
                    </div>
                </div>
            </div>
        </div>
    </div> -->

<body class="" ng-app="MixPortal">
    <div id="particles-js" class="position-absolute w-100 h-100"></div>
    <mix-loader ng-show="isBusy"></mix-loader>

    <div class="form-signin">
        @RenderBody()
    </div>

    <environment names="Development">
    </environment>
    <script src="~/js/framework.min.js"></script>
    <script src="~/js/app-security.min.js"></script>
    <script src="~/js/app-shared.min.js"></script>

    @RenderSection("Scripts", required: false)

    <!-- Modal -->
    <div class="modal fade" id="termAndCondition" tabindex="-1" role="dialog" aria-labelledby="termAndConditionTitle" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="termAndConditionTitle">Terms and Conditions.</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
                </div>
                <div class="modal-footer justify-content-center">
                    <button type="button" class="btn btn-primary" data-dismiss="modal">I have read and understand!</button>
                </div>
            </div>
        </div>
    </div>

    <script>particlesJS('particles-js',
        {
          "particles": {
            "number": {
              "value": 50,
              "density": {
                "enable": true,
                "value_area": 800
              }
            },
            "color": {
              "value": "#ffffff"
            },
            "shape": {
              "type": "circle",
              "stroke": {
                "width": 0,
                "color": "#000000"
              },
              "polygon": {
                "nb_sides": 5
              },
              "image": {
                "src": "img/github.svg",
                "width": 100,
                "height": 100
              }
            },
            "opacity": {
              "value": 0.2,
              "random": false,
              "anim": {
                "enable": false,
                "speed": 1,
                "opacity_min": 0.1,
                "sync": false
              }
            },
            "size": {
              "value": 3,
              "random": true,
              "anim": {
                "enable": false,
                "speed": 40,
                "size_min": 0.1,
                "sync": false
              }
            },
            "line_linked": {
              "enable": true,
              "distance": 150,
              "color": "#ffffff",
              "opacity": 0.2,
              "width": 1
            },
            "move": {
              "enable": true,
              "speed": 3,
              "direction": "none",
              "random": false,
              "straight": false,
              "out_mode": "out",
              "bounce": false,
              "attract": {
                "enable": false,
                "rotateX": 600,
                "rotateY": 1200
              }
            }
          },
          "interactivity": {
            "detect_on": "window",
            "events": {
              "onhover": {
                "enable": true,
                "mode": "grab"
              },
              "onclick": {
                "enable": true,
                "mode": "push"
              },
              "resize": true
            },
            "modes": {
              "grab": {
                "distance": 200,
                "line_linked": {
                  "opacity": 0.2
                }
              },
              "bubble": {
                "distance": 400,
                "size": 40,
                "duration": 2,
                "opacity": 8,
                "speed": 3
              },
              "repulse": {
                "distance": 200,
                "duration": 0.4
              },
              "push": {
                "particles_nb": 4
              },
              "remove": {
                "particles_nb": 2
              }
            }
          },
          "retina_detect": true
        });</script>
</body>
</html>